<template>
	<view class="">
		<view class="flex" style="">
			<view class="  p20" style="background-color: #fff;width: 100%;">
				<scroll-view scroll-y="true" class="scroll-Y">
					<uni-card>
						<template v-slot:title>
							<view class="m-l-10">
								<uni-row>
									<uni-col :xs="10" :md="4">
										<view class="button_space ml1" style="padding-top: 10px;">
											<button @click="on_add(0)" type="primary" size="mini">添加</button>
										</view>
									</uni-col>
								</uni-row>
							</view>
						</template>
						<uni-table border stripe type="selection" :type="'2'" @selection-change="selectionData">
							<uni-tr>
								<uni-th align="center">id</uni-th>
								<uni-th align="center">导航名称</uni-th>
								<uni-th align="center">导航图片</uni-th> 
								<uni-th align="center" >管理</uni-th>
							</uni-tr>

							<uni-tr v-for="(vo,index) in list" :key="index">

								<uni-td align="center">
									<view >{{vo.id}}</view>
								</uni-td>
								<uni-td align="center">
									<view >{{vo.name}}</view>
								</uni-td>
								<uni-td align="center"> 
										<image class="q_y" :src="vo.img|getImg" style="width: 80px;height: 80px;" mode="">
										</image>
								</uni-td>
								<uni-td  align="center">
									<view class="">
										<button @click="on_edit(index)" type="primary" size="mini"
											style="background-color: #1E90FF;">编辑</button>
									</view>
								 
									<button @click="on_del(index)" style="background-color: #D3D3D3;" type="primary"
										size="mini">删除</button>

								</uni-td>
							</uni-tr>
						</uni-table>
						<template v-slot:actions>
							<view style="width: 100%;">
								<uni-pagination @change="getPage" show-icon="true" :total="total" current="1"
									style="float: left;margin-bottom: 10px;"></uni-pagination>
							</view>
						</template>
					</uni-card>
				</scroll-view>
			</view>
		</view>


		<edit v-if="is_edit" :id="id" ref="component_edit" @confirm="confirm_edit" @close="is_edit=false">
		</edit>
	</view>
</template>

<script>
	import edit from './shop_nav_add.vue';
	export default {
		components: {
			edit


		},
		data() {
			return {
				list: [],
				last_page: 0,
				total: 0,
				page: 1,
				name: '',
				keya: '',
				uid: '',
				tel: '',
				url: '',
				is_edit: false,
				id: 0
			}
		},
		onShow() {
			this.init();
		},

		methods: {
			on_add(){
				this.id = 0
				this.is_edit = true;
			},
			confirm_edit() {
				if (this.id == 0) {
					this.page = 1;
				}
				this.init();
			 	 this.is_edit=false;
			},
			on_edit(index) {
				this.id = this.list[index]['id']; 
				this.is_edit = true;

			},
			getPage(id) {

				this.page = id.current;
				this.init()
			},
			on_del(index) {
				var that = this;
				var id = this.list[index]['id'];
				uni.showModal({
					title: '提示',
					content: '确认删除吗？',
					success: function(res) {
						if (res.confirm) {
							that.ajax_del(id);
						}
					}
				});

			},
			ajax_del(id) {
				var that = this;

				let requestParams = {
					id: id,
				};
				this.Http.post('banmichaoqiangbizhi/admin/Shopnav/dels_scdh', requestParams).then(ret => {
					var find = ret.data;
					uni.showToast({
						title: ret.msg,
						icon: 'none'
					})
					that.list = that.list.filter(t => t.id != id);
				})





			},



			init() {
				var that = this;

				let requestParams = {

				};
				this.Http.post('banmichaoqiangbizhi/admin/Shopnav/paginate_dhlb',requestParams).then(ret => {
				
					this.list = ret.data.list.list;
					this.total = ret.data.list.total;
				})



			},




		}
	}
</script>

<style>
	page {
		background-color: #F2F5FF;
	}

	.feng {
		color: red;
	}
</style>